<template>
  <div class="app-container" style="align-content: center;" v-loading="loading">
    <el-container>
      <el-main>
        <el-row :gutter="20" style="margin-top:-20px">
          <el-col :span="24"><h2>患者信息</h2></el-col>
          <el-col :span="24">
            <el-card style="width: 100%;background-color: #FFF;margin-left: 0" >
              <span class="nameStyle">{{patient.patientName}}</span>
              <el-descriptions :column="4" :labelStyle="labelStyle" :contentStyle="contentStyle" border>
                <el-descriptions-item label="性别">{{ gender }}</el-descriptions-item>
                <el-descriptions-item label="年龄">{{patient.patientAge}}</el-descriptions-item>
                <el-descriptions-item label="身份证号">{{patient.patientIdentityNo}}</el-descriptions-item>
                <el-descriptions-item label="联系方式">{{patient.patientPhone}}</el-descriptions-item>
              </el-descriptions>
            </el-card>

          </el-col>
        </el-row>

        <el-row :gutter="20" style="margin-top: 15px">
          <el-col :span="19"><h2>就诊时间线</h2></el-col>
          <el-col :span="4">
            <el-date-picker
              v-model="year"
              type="year"
              placeholder="年份筛选"
              class="picker">
            </el-date-picker>
          </el-col>
          <el-col :span="24">
            <div class="clinic-timeline">
              <div
                tabindex="1"
                class="el-card2 is-always-shadow"
                v-for="(clinic,index) in clinicTime"
                :key=index
                @click="changeclinic(index)"
              >
                <div class="el-card-body">
                  <div class="el-label-0">
                    <label>{{ clinic.split('\n')[0].substr(-3,2) }}</label>
                  </div>
                  <div>
                    <ul>
                      <li>{{ clinic.split('\n')[0] }}</li>
                      <li>{{ clinic.split('\n')[1] }}</li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
          </el-col>
        </el-row>
        <el-row :gutter="20" style="margin-top: 15px">
          <el-col :span="24">
            <h2>就诊信息</h2>
          </el-col>
        </el-row>
        <el-row :gutter="20" id="fullContentId">
          <el-col :span="4">
            <div class="grid-content2 bg-purple-light">
              <p>病种：{{ clinic.disease }}</p>
              <p>科室：{{ clinic.department }}</p>
              <p>病区：{{ clinic.ward }}</p>
              <p>床号：{{clinic.bedNum}}</p>
            </div>
          </el-col>
          <el-col :span="4">
            <div  class="grid-content2 bg-purple-light illSum" @click="openFullDialogIllSum">
              <h2>病情摘要</h2>
              <div class="text-ellipsis">{{clinic.illnessSummary}}</div>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="grid-content2 bg-purple-light preDia" @click="openFullDialogPreDia">
              <h2>诊断</h2>
              <div class="text-ellipsis">{{clinic.preDiagnose}}</div>
            </div>
          </el-col>
          <el-col :span="5">
            <div class="grid-content2 bg-purple-light preHis" @click="openFullDialogPreHis">
              <h2>既往史</h2>
              <div class="text-ellipsis">{{clinic.preHistory}}</div>
            </div>
          </el-col>
          <el-col :span="5">
            <div class="grid-content2 bg-purple-light famHis" @click="openFullDialogFamHis">
              <h2>家族史</h2>
              <div class="text-ellipsis">{{clinic.familyHistory}}</div>
            </div>
          </el-col>
        </el-row>
        <!-- 对比用户所有评定任务 -->
        <el-dialog
          title=""
          class="myDialog"
          :visible.sync="dialogVisible"
          width="70%">
          <template slot="title">
            患者{{patient.patientName}}的所有已评定任务列表
          </template>

          <el-table ref="table" v-loading="loading" :data="allAssessedList" @selection-change="handleSelectionChange" :default-sort = "{prop: 'date', order: 'descending'}">
            <el-table-column type="selection" width="55" align="center"/>
            <el-table-column label="数据编号" align="center" prop="taskId" sortable/>
            <el-table-column label="评定表名称" align="center" prop="assessName"/>
            <el-table-column label="主治医生姓名" align="center" prop="masterName"/>
            <el-table-column label="评定医生姓名" align="center" prop="doctorName"/>
            <el-table-column label="评定阶段" align="center" prop="phase">
              <template slot-scope="scope">
                <dict-tag :options="dict.type.pd_phase" :value="scope.row.phase"/>
              </template>
            </el-table-column>
            <el-table-column label="评定时间" align="center" prop="updateTime"/>
          </el-table>
          <template>
            <el-backtop target=".myDialog" :bottom="100" :right="120">
              <div
                style="{
              height: 100%;
              width: 100%;
              background-color: #f2f5f6;
              box-shadow: 0 0 6px rgba(0,0,0, .12);
              border-radius: 20px;
              text-align: center;
              line-height: 40px;
              color: #1989fa;
            }"
              >
                <i class="el-icon-caret-top"></i>
              </div>
            </el-backtop>
          </template>
          <span slot="footer" class="dialog-footer">
            <el-button class="myDialogButton" type="success" @click="showAssessAnalysis" plain>对比详情</el-button>
          </span>
        </el-dialog>
<!--        <el-row style="margin: 20px 0"><hr style="border: 6px solid #9d9d9d;"/></el-row>-->
        <el-row style="margin-top: 25px">
          <div style="width:100%;padding-right: 10px">
            <h2 style="display: inline-block;margin: 20px 10px">评定信息</h2>
            <el-button class="button-style1" v-hasPermi="['system:patient:detail:schedule']" @click="addAssess">新增评定</el-button>
            <el-button class="button-style2" type="primary" @click="analysisComparison">分析对比</el-button>
          </div>
          <div class="assess-list">
            <div class="article-tile">
              <div
                class="el-card1 is-always-shadow"
                v-for="(assdata,index) in datalist"
                :key=index
                :timestamp="assdata.data.createTime"
                @click="showdata(assdata)"
                v-show="!nothing"
              >
                <div class="el-card-body">
                  <div class="el-label-1">
                    <label v-show="assdata.data.phase=='1'">初期</label>
                    <label v-show="assdata.data.phase=='2'">中期</label>
                    <label v-show="assdata.data.phase=='3'">末期</label>
                  </div>
                  <div style="margin: 8px 25px">
                    <p>评定内容: {{ assdata.assessName }}</p>
                    <p>评定时间：{{ assdata.data.createTime }}</p>
                    <p>评定医师：{{ assdata.doctorName }}</p>
                  </div>
                </div>
              </div>
              <div v-show="nothing" style="margin: auto;font-size: 26px;color: #888888">
                暂无评定信息
              </div>
            </div>
          </div>
          <el-col style="margin-top: 2%;text-align: center">
            <el-button  @click="goBack">返 回</el-button>
          </el-col>
        </el-row>
      </el-main>
    </el-container>

    <el-dialog
      :title="fullContentTitle"
      :visible.sync="fullContentDia"
      width="45%" >
      <span>{{fullContentText}}</span>
      <span slot="footer" class="dialog-footer"></span>
    </el-dialog>
    <!-- 全屏对比dialog -->
    <el-dialog
      title="详情对比"
      :visible.sync="dialogVisibleFull"
      fullscreen
      ref="myDialog"
      :showClose="false"
      :before-close="handleCloseFull">

      <div :class="{ dialogDiv: comList.length === 1 }">
        <!-- 叉号 按钮 -->
        <el-row>
          <el-button class="closeFullDialog"  type="text" icon="el-icon-close" @click="handleCloseFull"></el-button>
        </el-row>

        <el-button class="addFullDialog" type="success"  @click="addComparisonAssess(comList)">新增对比表</el-button>


        <!-- 每一张要对比的评定表 -->

          <el-row :gutter="20" type="flex" :style="comList.length === 1 ? {width: 60+'%'} : {width: `${50 * comList.length}%`}">
            <el-col v-for="(item1, index1) in comList" :key="index1">
              <el-card class="fullCard">
                <el-row type="flex" justify="center">
                  <el-col style="text-align: center" v-show="item1.phase === '1'">
                    <h1>
                      {{ item1.assessName }}
                    </h1>
                    <h3>
                      评定阶段：初期 第 {{ item1.phaseCount }} 次
                    </h3>
                  </el-col>
                  <el-col style="text-align: center" v-show="item1.phase === '2'">
                    <h1>
                      {{ item1.assessName }}
                    </h1>
                    <h3>
                      评定阶段：中期 第 {{ item1.phaseCount }} 次
                    </h3>
                  </el-col>
                  <el-col style="text-align: center" v-show="item1.phase === '3'">
                    <h1>
                      {{ item1.assessName }}
                    </h1>
                    <h3>
                      评定阶段：末期 第 {{ item1.phaseCount }} 次
                    </h3>
                  </el-col>
                  <el-col :span="2">
                    <el-popconfirm
                      title="确定删除吗？"
                      @confirm="deleteAssess(index1)"
                    >
                      <el-button slot="reference" icon="el-icon-close" circle></el-button>
                    </el-popconfirm>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col class="basicCondition">
                    <el-row>
                      <el-col>
                        <div>
                          <h3 class="h2Bold">一、基本情况</h3>
                        </div>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span="4">姓名: {{ patient.patientName }}</el-col>
                      <el-col :span="4">性别: {{ gender }}</el-col>
                      <el-col :span="4">年龄: {{ patientAge }}</el-col>
                      <el-col :span="4">科室: {{ department }}</el-col>
                    </el-row>
                    <el-row>患者编号：{{ patient.patientNo }}</el-row>
                    <el-row style="letter-spacing:0.1em;line-height: 1.5em;">病情摘要：{{ illnessSummary }}</el-row>
                    <el-row style="letter-spacing:0.1em;line-height: 1.5em;">既往史：{{ preHistory }}</el-row>
                    <el-row style="letter-spacing:0.1em;line-height: 1.5em;">诊断：{{ preDiagnose }}</el-row>
                    <el-row>
                      <el-col :span="6">
                        评定日期：{{ item1.createTime.slice(0,10) }}
                      </el-col>
                      <el-col :span="6">
                        评定人：{{ item1.doctorName }}
                      </el-col>
                    </el-row>
                  </el-col>
                </el-row>

                <div v-for="(item2,index2) in item1.assessConfig" :key="index2">
                  <el-row type="flex" align="middle" style="margin-top: 10px">
                    <el-col>
                      <div class="grid-content">
                        <h3 class="h2Bold">{{ item2.titleName }}</h3>
                      </div>
                    </el-col>
                  </el-row>
                  <div class="containerClass">
                    <el-row v-for="(assname, index3) in item2.assConfig" :assname="assname" :key="index3">
                      <el-col :span="22" :offset="1">
                        <keep-alive>
                          <component
                            :is="assname"
                            :istrans="true"
                            ref="childComponent"
                            style="pointer-events: none;"
                            :fromdata="comList[index1].assessData[assname]"
                          ></component>
                        </keep-alive>
                      </el-col>
                    </el-row>
                  </div>
                </div>
              </el-card>
            </el-col>


          </el-row>


      </div>

    </el-dialog>
    <!-- 新增对比表dialog -->
    <el-dialog
      title=""
      class="myDialog"
      :visible.sync="dialogVisibleAdd"
      width="70%">
      <template slot="title">
        患者{{patient.patientName}}可添加对比的任务列表
      </template>

      <el-table ref="tableAdd" v-loading="loading" :data="allAssessedListFull" @selection-change="handleSelectionChangeFull" :default-sort = "{prop: 'date', order: 'descending'}">
        <el-table-column type="selection" width="55" align="center"/>
        <el-table-column label="数据编号" align="center" prop="taskId" sortable/>
        <el-table-column label="评定表名称" align="center" prop="assessName"/>
        <el-table-column label="主治医生姓名" align="center" prop="masterName"/>
        <el-table-column label="评定医生姓名" align="center" prop="doctorName"/>
        <el-table-column label="评定阶段" align="center" prop="phase">
          <template slot-scope="scope">
            <dict-tag :options="dict.type.pd_phase" :value="scope.row.phase"/>
          </template>
        </el-table-column>
        <el-table-column label="评定时间" align="center" prop="updateTime"/>
      </el-table>
      <template>
        <el-backtop target=".myDialog" :bottom="100" :right="120">
          <div
            style="{
              height: 100%;
              width: 100%;
              background-color: #f2f5f6;
              box-shadow: 0 0 6px rgba(0,0,0, .12);
              border-radius: 20px;
              text-align: center;
              line-height: 40px;
              color: #1989fa;
            }"
          >
            <i class="el-icon-caret-top"></i>
          </div>
        </el-backtop>
      </template>
      <span slot="footer" class="dialog-footer">
            <el-button class="myDialogButton" type="success" @click="showAssessAnalysisAdd" plain>提 交</el-button>
          </span>
    </el-dialog>
  </div>

</template>


<script>
import {listClinic} from "@/api/gaoxin/clinic";
import {listTask, listAllAssessedTask} from "@/api/gaoxin/taskdata";
import {delData, listData} from "@/api/gaoxin/data";
import {getPatient, listPatient} from "@/api/gaoxin/patient";
import {getUser} from "@/api/system/user";
import dayjs from "@/api/gaoxin/dayjs.min";

export default {
  name: "detail",
  dicts: ['pd_phase'],
  data() {
    return {
      fullContentDia:false,
      fullContentTitle:'',
      fullContentText:'',
      labelStyle:{
        'font-size':'16px',
        'text-align': 'center',
        'background-color':'#f5f7fa',
        'color': '#000',
      },
      contentStyle:{
        'color': '#000',
        'text-align': 'center',
        'font-size':'16px',
        'font-weight': '400',
      },
      patientId:null,
      year:'',
      // 从就诊过来的 患者详情 的 基本信息
      onePatient: [],
      patientJob: '',
      patientGender: '',
      patientAge: '',
      patientHeight: '',
      patientWeight: '',
      patientBirthday: '',
      patientMarriage: '',
      patientFolk: '',
      patientPhone: '',
      patientIdentityNo: '',
      patientAddress: '',
      //就诊信息
      manageId: '',
      source: '',
      department: '',
      disease: '',
      ward: '',
      preDiagnose: '',
      illnessSummary: '',
      preHistory: '',
      // 接诊医生、管床医生名
      manageName: '',
      // 一线医生名
      firstName: '',
      // 二线医生名
      secondName: '',
      masterName:'',
      // 表格数据：某患者所有已评定任务列表
      allAssessedList: [],
      // 全屏dialog中的表格数据
      allAssessedListFull: [],
      isFull: false,
      // 选中数组
      selections: [],
      selectionsAdd: [],
      // 非多个禁用
      multiple: true,
      // 任务id
      taskId: '',
      //患者基本信息
      patient: {},
      //患者的就诊信息列表
      clinicList: [],
      // 患者当前就诊信息
      clinic: {},
      // 患者就诊信息对应的任务列表
      tasklist: [],
      // 某次就诊的数据列表
      datalist: [],
      // 遮蔽层加载
      loading: false,
      // 限制update中的函数只执行一次
      count: 0,
      //查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        patientNo: null,
        patientName: null,
        patientBirthday: null,
        patientAge: null,
        patientGender: null,
        patientIdentityNo: null,
        patientJob: null,
        patientWeight: null,
        patientHeight: null,
        patientFolk: null,
        patientAddress: null,
        patientPhone: null,
        patientMarriage: null,
        patientStatus: null,
        phase:null,
      },
      // 弹窗查询参数
      queryParamsDialog: {
        // pageNum: 1,
        // pageSize: 40,
        patientId: null,
        patientName: null,
        masterName: null,
        doctorName: null,
        assessName: null,
        phase: null,
        status: '2',
        createTime: null,
        clinicId: null,
      },
      //el-description 尺寸
      size: '',
      clinicOptions: [],
      clinicValue: '',
      dialogVisible: false,
      dialogVisibleAdd: false,
      //全屏dialog开关
      dialogVisibleFull: false,
      comList: [],
      nothing: null,
    }
  },
  created() {

    const path = this.$route.path;
    const patientId = Number(path.split('/').slice(-1));
    this.patientId = patientId;
    // this.patientId=this.$route.params.patientId
    this.queryParamsDialog.patientId = this.patientId
    this.queryParams.patientNo = this.patient.patientNo

    this.getPatientDetail()
    this.getList()
    this.getlistClinic()
  },

  //监视 接诊医生、一线、二线医生 id 的变化来查询 医生名
  watch: {
    "clinic.manageId": {
      deep: true,
      handler(val){
        this.getManageName()
      }
    },
    "clinic.firstDoctorId": {
      deep: true,
      handler(val){
        this.getFirstName()
      }
    },
    "clinic.secondDoctorId": {
      deep: true,
      handler(val){
        this.getSecondName()
      }
    },
  },

  methods: {
    openFullDialogIllSum(){
      let illSum=document.querySelector('.illSum')
      this.fullContentTitle=illSum.children[0].innerText;
      this.fullContentText=illSum.children[1].innerText;
      this.fullContentDia=true;
    },
    openFullDialogPreDia(){
      let preDia=document.querySelector('.preDia')
      this.fullContentTitle=preDia.children[0].innerText;
      this.fullContentText=preDia.children[1].innerText;
      this.fullContentDia=true;
    },
    openFullDialogPreHis(){
      let preHis=document.querySelector('.preHis')
      this.fullContentTitle=preHis.children[0].innerText;
      this.fullContentText=preHis.children[1].innerText;
      this.fullContentDia=true;
    },
    openFullDialogFamHis(){
      let famHis=document.querySelector('.famHis')
      this.fullContentTitle=famHis.children[0].innerText;
      this.fullContentText=famHis.children[1].innerText;
      this.fullContentDia=true;
    },

    getPatientDetail() {
      getPatient(this.patientId).then(response => {
        this.patient = response.data;
      });
    },

    getClinicArchive(clinicId) {
      listClinic({clinicId:clinicId}).then(response => {
        let clinicStatus = response.rows[0].status;
        if (clinicStatus == '1') {//已归档

        }
      })
    },
    getManageName() {
      if(this.clinic.manageId === null){
        this.manageName = ''
        return
      }
      getUser(this.clinic.manageId).then(response => {
        this.manageName = response.data.nickName;
      });
    },
    getFirstName() {
      if(this.clinic.firstDoctorId === null){
        this.firstName = ''
        return
      }
      getUser(this.clinic.firstDoctorId).then(response => {
        this.firstName = response.data.nickName;
      });
    },
    getSecondName() {
      if(this.clinic.secondDoctorId === null){
        this.secondName = ''
        return
      }
      getUser(this.clinic.secondDoctorId).then(response => {
        this.secondName = response.data.nickName;
      });
    },
    // 根据patientid查询用户基本信息
    getList() {
      this.loading = true;
      listPatient(this.queryParams).then(response => {
        this.onePatient = response.rows;
        this.patientJob = this.onePatient[0].patientJob
        this.patientGender = this.onePatient[0].patientGender
        this.patientAge = this.onePatient[0].patientAge
        this.patientHeight = this.onePatient[0].patientHeight
        this.patientWeight = this.onePatient[0].patientWeight
        this.patientBirthday = this.onePatient[0].patientBirthday
        this.patientMarriage = this.onePatient[0].patientMarriage
        this.patientFolk = this.onePatient[0].patientFolk
        this.patientPhone = this.onePatient[0].patientPhone
        this.patientIdentityNo = this.onePatient[0].patientIdentityNo
        this.patientAddress = this.onePatient[0].patientAddress
        this.loading = false;
      });
    },
    // 修改就诊记录
    changeclinic(index) {
      this.clinic = this.clinicList[index];
      this.getManageName()
      this.getFirstName()
      this.getSecondName()
      this.getlisttask();
    },
    // 返回按钮
    fanhui() {
      this.$tab.closePage();
      this.$router.go(-1);
    },
    /**展示数据页面**/
    showdata(assdata) {
      let taskId = assdata.data.taskId;
      let patientId = this.patientId;
      this.$router.push({path: '/patient/assess/detail/', query: {taskId: taskId, patientId: patientId}});
    },

    /** 查询就诊信息列表 */
    getlistClinic() {
      listClinic({
        patientId: this.patientId,
      }).then(response => {
        this.clinicList = response.rows;
        this.clinicOptions = this.clinicList;
        //默认选中最近的一次就诊
        this.clinic = this.clinicList[this.clinicList.length-1];
        this.source = this.clinic.source
        this.department = this.clinic.department
        this.disease = this.clinic.disease
        this.ward = this.clinic.ward
        this.preDiagnose = this.clinic.preDiagnose
        this.illnessSummary = this.clinic.illnessSummary
        this.preHistory = this.clinic.preHistory
        this.manageId = this.clinic.manageId
        this.firstName = this.clinic.firstName
        this.secondName = this.clinic.secondName
        this.getlisttask()
      });
    },
    // 查询任务信息列表
    getlisttask() {
      listTask({
        clinicId: this.clinic.clinicId,
        status: null,
      }).then(res => {
        this.nothing = false
        this.tasklist = res.rows;
        if (this.tasklist.length === 0) {
          this.nothing = true
          this.loading = false;
          return this.nothing
        }
        this.getlistdata();
      })
    },
    //查询任务数据信息列表
    getlistdata() {
      this.datalist = [];
      for (const task of this.tasklist) {

        listData({
          taskId: task.taskId
        }).then(res => {
          if (res.rows.length > 0) {
            for (const row of res.rows) {
              this.datalist.push({
                patientName: task.patientName,
                masterName: task.masterName,
                assessName: task.assessName,
                assessId: task.assessId,
                doctorName: task.doctorName,
                // taskId:task.taskId,
                data: row
              })
            }
          }
          this.masterName=this.datalist[0].masterName
          this.phase=this.datalist[0].data.phase
          this.loading = false;
          this.datalist.sort(function (a, b) {
            return Date.parse(new Date(a.data.createTime)) - Date.parse(new Date(b.data.createTime));
          })
        })
      }

    },
    /** 查询任务列表 */
    getdataList(taskId) {
      this.loading = true;
      this.queryParams.taskId = taskId;
      listData(this.queryParams).then(response => {
        this.dataList = response.rows;
        this.loading = false;
      });
    },
    // 弹窗内容
    analysisComparison() {
      this.loading = true;
      listAllAssessedTask(this.queryParamsDialog).then(response => {
        this.allAssessedList = response.rows;
        this.loading = false;
        this.dialogVisible = true
      });
    },
    // 新增对比表弹窗内容
    addComparisonAssess() {
      this.loading = true;
      listAllAssessedTask(this.queryParamsDialog).then(response => {
        this.allAssessedListFull = response.rows;
        this.comList.forEach((item1, index1) => {
          this.allAssessedListFull.forEach((item2, index2) => {
            if(item2.taskId === item1.taskId) {
              this.allAssessedListFull.splice(index2, 1);
            }
          });
        });
        this.loading = false;
        this.dialogVisibleAdd = true
      });
    },
    //复选框
    handleSelectionChange(rows) {
      this.selections = rows.map(item => item);
    },
    handleSelectionChangeFull(rows) {
      this.selectionsAdd = rows.map(item => item);
    },
    // 新的对比页面展示
    showAssessAnalysis() {
      /** 至少选择一张 **/
      if (this.selections.length < 1) {
        this.$message.warning('请至少选择1张表！');
        return
      }
      /** 根据 assessId 使用isAllEqual()函数判断选择的是否是同一张表 **/
      let assessIdList = [];
      this.selections.forEach(item => {
        assessIdList.push(item.assessId);
      });
      if(!this.isAllEqual(assessIdList)) {
        this.$message.warning('请重新选择评定表相同的任务进行对比！')
        return
      }
      /** 深拷贝一份selection给comList，然后解析comList中的assessConfig **/
      this.comList = JSON.parse(JSON.stringify(this.selections));
      this.comList.forEach(item => {
        item.assessConfig = JSON.parse(item.assessConfig);
      })
      /** 调用quzhuanyi()函数 将 assessData 中的 / 去掉，然后解析成js对象 **/
      this.quzhuanyi();
      this.dialogVisibleFull = true;
      this.$nextTick(() => {
        const sum = this.$refs.childComponent.length;
        const start = sum / this.comList.length;
        const result = this.diffAssessData(start - 1);
        for (const key in result) {
          result[key].forEach(item => {
            const selectElement = this.$refs.childComponent[key].$refs[item].$el;
            selectElement.style.border = "2px solid red";
            selectElement.style.borderRadius = "5px";
          })
        }
      });



      // this.$router.push({
      //   name: 'duibi',
      //   params: {assdata: this.comList,taskId:this.taskId,pat:this.patient}
      // });
    },
    showAssessAnalysisAdd() {
      if (this.selectionsAdd.length < 1) {
        this.$message.warning('请至少新增1张表！');
        return
      }
      let assessIdList = [];
      this.selectionsAdd.forEach(item => {
        assessIdList.push(item.assessId);
      });
      this.selections.forEach(item => {
        assessIdList.push(item.assessId);
      });
      if(!this.isAllEqual(assessIdList)) {
        this.$message.warning('请重新选择评定表相同的任务进行对比！')
        return
      }

      let Add = JSON.parse(JSON.stringify(this.selectionsAdd));
      Add.forEach(item => {
        item.assessConfig = JSON.parse(item.assessConfig);
      })
      let result = this.quzhuanyiAdd(Add);// 去除 assessData中的 / 并 解析成js对象
      result.forEach(item => {
        this.comList.push(item);
      });
      this.$nextTick(() => {
        const sum = this.$refs.childComponent.length;
        const start = sum / this.comList.length;
        const result = this.diffAssessData(start - 1);
        for (const key in result) {
          result[key].forEach(item => {
            const selectElement = this.$refs.childComponent[key].$refs[item].$el;
            selectElement.style.border = "2px solid red";
            selectElement.style.borderRadius = "5px";
          })
        }
      });
      this.dialogVisibleAdd = false;
    },
    //删除一张对比表
    deleteAssess(index) {
      this.comList.splice(index, 1);
    },
    //全屏dialog关闭回调
    handleCloseFull () {
      this.$confirm('确认关闭？')
        .then(_ => {
          this.dialogVisible = false;
          this.dialogVisibleFull = false;
          this.comList = [];
          done();
        })
        .catch(_ => {});
    },
    isAllEqual(array) {
      if (array.length > 0) {
        return !array.some(function (value, index) {
          return value !== array[0];
        });
      } else {
        return true;
      }
    },
    quzhuanyi() {
      this.comList.forEach(item => {
        let temp = item.assessData;
        let reg=/\\/g;
        let replaceAfter = temp.toString().replace(reg,'');
        item.assessData = JSON.parse(replaceAfter);
      })
      // var temp1 = this.fromdata[0].assessData;
      // var reg=/\\/g;
      // let replaceAfter = temp1.toString().replace(reg,'');
      // this.fromdata[0].assessData = JSON.parse(replaceAfter)
      // if(this.isdouble){
      //   var temp1=this.fromdata[1].assessData;
      //   var reg=/\\/g;
      //   let replaceAfter = temp1.toString().replace(reg,'');
      //   this.fromdata[1].assessData = JSON.parse(replaceAfter)
      // }
    },
    quzhuanyiAdd(add) {
      add.forEach(item => {
        let temp = item.assessData;
        let reg=/\\/g;
        let replaceAfter = temp.toString().replace(reg,'');
        item.assessData = JSON.parse(replaceAfter);
      });
      return add;
    },
    addAssess(){
      let patientId = this.patientId;
      getPatient(patientId).then(response => {

        let patientStatus = response.data.patientStatus;
        if (patientStatus == '1') {//未就诊
          this.modal.msgSuccess("该患者未就诊，无法分派评定任务");
        } else {//就诊中
          listClinic({patientId: patientId}).then(response => {
            let clinicId = response.rows[0].clinicId;
            this.$router.push("/workflow/task/schedule/" + clinicId)
          })

        }
      });

      // this.$router.push({name: 'Clinic'});
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const taskIds = row.taskId;
      this.$modal.confirm('是否确认删除assess编号为"' + taskIds + '"的数据项？').then(function () {
        return delData(taskIds);
      }).then(() => {
        this.getdataList(this.taskId);
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {
      });
    },
    goBack() {
      this.$tab.closePage();
      this.$router.go(-1);
    },
    diffAssessData(start) {
      const result = {};
      for (let i = 1; i < this.comList.length; i++) {
        for (const key in this.comList[i].assessData) { // 7 个 组件名key
          start++;
          const objValues = Object.values(this.comList[0].assessData[key]);
          const valueObj = this.comList[i].assessData[key];
          let index = 0;
          for (const valueKey in valueObj) {
            const value = valueObj[valueKey];
            if (value instanceof Array) {
              const isEqual = value.length === objValues[index].length && value.every((item, index1) => item === objValues[index][index1]);
              if (!isEqual) {
                if (start in result) {
                  result[start].push(valueKey);
                } else {
                  result[start] = [valueKey];
                }
                index++;
              }
            } else {
              if (value !== objValues[index++]) {
                if (start in result) {
                  result[start].push(valueKey);
                } else {
                  result[start] = [valueKey];
                }
              }
            }

          }
        }
      }
      return result;
    }
  },
  computed: {

    formatCreateTime: {
      get(){
        let list = [];
        this.clinicOptions.forEach(item => {
          list.push(dayjs(item.createTime).format('YYYY - MM - DD'));
        })
        return list;
      }
    },

    formatOutTime: {
      get(){
        let list = [];
        this.clinicOptions.forEach(item => {
          list.push(dayjs(item.outTime).format('YYYY - MM - DD'));
        })
        return list;
      }
    },

    clinicTime: {
      get(){
        let list = []
        for(let i = 0;i<this.formatCreateTime.length;i++){
          if(this.formatOutTime[i] === 'Invalid Date'){
            this.formatOutTime[i] = '至今'
          }

          if(this.year==''){
            if(this.clinicList[i].source === '0'){
              list.push(this.formatCreateTime[i]+'【门诊】'+'\n'+this.formatOutTime[i]+`${this.formatOutTime[i]=='至今' ? ' ': '【门诊】'}`)
            }else {
              list.push(this.formatCreateTime[i]+'【住院】'+'\n'+this.formatOutTime[i]+`${this.formatOutTime[i]=='至今' ? ' ': '【出院】'}`)
            }
          }else {
            let subYear=this.formatCreateTime[i].split(' ')[0]
            if(subYear==this.year.getFullYear()){
              if(this.clinicList[i].source === '0'){
                list.push(this.formatCreateTime[i]+'【门诊】'+'\n'+this.formatOutTime[i]+`${this.formatOutTime[i]=='至今' ? ' ': '【门诊】'}`)
              }else {
                list.push(this.formatCreateTime[i]+'【住院】'+'\n'+this.formatOutTime[i]+`${this.formatOutTime[i]=='至今' ? ' ': '【出院】'}`)
              }
            }
          }
        }
        return list
      }
    },
    gender(){
      if(this.patientGender === '0') return '男'
      if(this.patientGender === '1') return '女'
      if(this.patientGender === '2') return '未知'
    },
    marriage(){
      if(this.patient.patientMarriage === '0') return '未婚'
      if(this.patient.patientMarriage === '1') return '已婚'
      if(this.patient.patientMarriage === '2') return '未知'
    },
  },
}
</script>

<style lang="scss" scoped>
.nameStyle {
  color: #000000;
  font-size: 28px;
  font-weight: 500;
  display: inline-block;
  margin-bottom: 20px;
}

.picker{
  margin-top: 18px;
  ::v-deep .el-input__inner {
    background-color: transparent !important;
    box-shadow: 0px 0px 2px 1px  #c3cfe2;
    height: 30px;
  }
}
.basic-name {
  font-size: 30px;
  font-weight: 400;
  text-align: center;
  margin-top: 12px;
}
.basic-content {
  font-size: 20px;
  text-align: center;
}
.grid-content1 {
  border-radius: 3px;
  height: 190px;
  padding: 8px;
}
.grid-content2 {
  border-radius: 4px;
  height: 220px;
  padding: 10px;
  cursor: pointer;
}

.grid-content2:hover {
  box-shadow: 0 6px 8px rgba(0, 0, 0, .20), 0 0 6px rgba(0, 0, 0, .04);
  //color: #4facfe;
}

.text-ellipsis {
  line-height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}


.myDialog{
  height: 100vh;
  overflow-x: hidden;
}

/*.assess-list {*/
/*  width: 1860px;*/
/*  height: 400px;*/
/*}*/

.article-tile {
  display: flex;
  justify-content: flex-start;
  /*自动换行*/
  flex-wrap: wrap;
  border: 2px dashed #7f8d9b;
  border-radius: 0.5rem;
  width: 100%;
  height: 100%;
  padding-bottom: 50px;
  overflow-y: auto;
  overflow-x: hidden;
}
.clinic-timeline {
  display: flex;
  justify-content: flex-start;
  border: 2px dashed #7f8d9b;
  border-radius: 0.5rem;
  height: 190px;
  padding: 8px;
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}


.el-card2 {
  display: inline-block;
  height: 120px;
  line-height: 34px;
  width: 260px;
  margin: 22px 25px;
  background-color: #f5f7fa;
  position: relative;
  border-radius: 4px;
  border: 1px solid #EBEEF5;
  overflow: hidden;
  -webkit-transition: .3s;
  transition: .3s;
  flex-shrink: 0;
  cursor: pointer;
}

.el-card2:focus,.el-card2:hover {
  box-shadow: 0 6px 8px rgba(0, 0, 0, .20), 0 0 6px rgba(0, 0, 0, .04);
  color: #4facfe;
}

.el-card1 {
  display: inline-block;
  width: 26%;
  height: 160px;
  margin: 50px 0 0 86px;
  line-height: 24px;
  background: #f5f7fa;
  font-size: 18px;
  position: relative;
  border-radius: 4px;
  border: 1px solid #EBEEF5;
  overflow: hidden;
  -webkit-transition: .3s;
  transition: .3s;
  flex-shrink: 0;
  cursor: pointer;
}
.el-card1:focus,.el-card1:hover {
  box-shadow: 0 6px 8px rgba(0, 0, 0, .20), 0 0 6px rgba(0, 0, 0, .04);
  color: #4facfe;
}

.el-card-body {
  padding: 20px;
  font-size: 16px;
  background: #f5f7fa;
}
.el-label-0 {
  position: absolute;
  height: 30px;
  width: 40px;
  top: 0px;
  left: 0px;
  padding-left: 3px;
  background-color: #c3cfe2;
}
.el-label-1 {
  position: absolute;
  top: 5px;
  left: 6px;
  padding: 2px;
  border-width: 1px;
  border-style: solid;
  border-color: black;
  border-radius: 10px;
}

.bg-purple-light {
  background: #f5f7fa;
}
.button-style1 {
  background-color: #fa964a;
  color: #FFFFFF;
  margin: 20px 10px;
  float: right;
}
.button-style2 {
  background-color: #34bfa3;
  color: #FFFFFF;
  margin: 20px 10px;
  float: right;
}

h2 {
  margin-left: 10px;
}
p {
  margin-left: 10px;
}

.basicCondition .el-row{
  margin-bottom: 20px;
}
.h2Bold {
  font-weight: 600;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}

.app-container {
  overflow: hidden;
}
.el-dialog{
  display: flex !important;
  flex-direction: column !important;
  margin: 0 !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  overflow-y: scroll !important;
  max-height: 100vh !important;
}

.closeFullDialog {
  position: fixed;
  right: 50px;
  top: 20px;
  font-size: x-large;
  color: red;
  z-index: 999;
}


.addFullDialog {
  position: absolute;
  left: 50%;
  top: 30px;

  z-index: 999;
}
.dialogDiv {
  display: flex;
  justify-content: center;
  align-items: center;
}
.fullCard {
  width: 100%;
  height: 100%;
  background-color: #FFFFFF;
}

</style>



















